<template>
  <div>
    money {{money}}
    <hr/>
    <Parent/>
  </div>
</template>

<script>
import { ref, provide } from 'vue';
import Parent from './Parent.vue'
export default {
  components: {
    Parent
  },
  setup () {
    const money = ref(100)
    const changeMoney = (num) => {
      money.value -= num
    }
    // !#1 通过 provide 提供数据
    provide('money', money)
    provide('changeMoney', changeMoney)

    return {money}
  }
}
</script>

<style lang="scss" scoped>

</style>